<template>
  <div v-if="reviewStageName === '项目立项'">
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目立项书">
          <el-link
            v-for="(item, index) in model.defaultProposaFileList"
            :key="index"
            @click="handlePreview(item)"
            >{{ item.fileName }}</el-link
          >
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目可行性研究报告">
          <el-link
            v-for="(item, index) in model.defaultFileList"
            :key="index"
            @click="handlePreview(item)"
            >{{ item.fileName }}</el-link
          >
        </el-form-item>
      </el-col>
    </el-row>
  </div>
  <div v-if="reviewStageName === '项目实施'">
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目实施计划">
          <el-table
            :data="model.tableData"
            border
            :header-cell-style="{
              background: '#eef1f6',
              color: '#606266'
            }"
          >
            <template #empty>
              <el-empty :image-size="40" description="暂无数据"></el-empty>
            </template>
            <el-table-column type="index" label="序号" />
            <el-table-column prop="time" label="起止时间"></el-table-column>
            <el-table-column prop="content" label="研究内容"></el-table-column>
            <el-table-column prop="goal" label="预期目标"></el-table-column>
            <el-table-column prop="isDone" label="是否完成">
              <template #default="{ row }">
                {{ row.isDone === "1" ? "是" : "否" }}
              </template>
            </el-table-column>
            <el-table-column prop="doneTime" label="完成时间"></el-table-column>
            <el-table-column prop="doneDes" label="完成情况"></el-table-column>
            <el-table-column prop="attachment" label="附件">
              <template #default="{ row }">
                <el-link
                  v-for="(item, index) in row.attachment"
                  :key="index"
                  @click="handlePreview(item)"
                  >{{ item.fileName }}</el-link
                >
              </template>
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-col>
    </el-row>
  </div>

  <div v-if="reviewStageName === '项目验收'">
    <el-row>
      <el-col :xl="24" :lg="24">
        <el-form-item label="项目目标及考核指标">
          <check-table-list
            :data="model.checkTableData"
            :isEdit="false"
          ></check-table-list>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目验收报告">
          <el-link
            v-for="(item, index) in model.reviewDefaultFileList"
            :key="index"
            @click="handlePreview(item)"
            >{{ item.fileName }}</el-link
          >
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目经费决算报告">
          <el-link
            v-for="(item, index) in model.approvalDefaultFileList"
            :key="index"
            @click="handlePreview(item)"
            >{{ item.fileName }}</el-link
          >
        </el-form-item>
      </el-col>
    </el-row>
  </div>

  <div v-if="reviewStageName === '项目后评价'">
    <BasicsInfo :projectInfo="model.projectInfo" :isApplication="true" />
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="后评价附件">
          <el-link
            v-for="(item, index) in model.evaluationAttachmentList"
            :key="index"
            @click="handlePreview(item)"
            >{{ item.name }}&nbsp;&nbsp;</el-link
          >
        </el-form-item>
      </el-col>
    </el-row>
  </div>

  <div v-if="reviewStageName === '项目变更'">
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="变更事由">
          {{ model.changeFormData.alterationReason }}
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="变更原因">
          {{ model.changeFormData.alterationMatters }}
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="变更时间">
          {{ model.changeFormData.alterationTime }}
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="备注">
          {{ model.changeFormData.remark }}
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24" v-if="model.changeBaseInfo">
        <el-form-item label="基础信息相关变更">
          <div v-html="model.changeBaseInfo" class="card-box-content"></div>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row v-if="model.changeTargetList && model.changeTargetList.length > 0">
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目目标及考核指标相关变更">
          <Goal :data="model.changeTargetList" :disabled="true" />
        </el-form-item>
      </el-col>
    </el-row>
    <el-row v-if="model.changePlan && model.changePlan.length > 0">
      <el-col :xl="16" :lg="24">
        <el-form-item label="项目计划相关变更">
          <Plan :data="model.changePlan" :disabled="true" />
        </el-form-item>
      </el-col>
    </el-row>
  </div>
  <div v-if="reviewStageName === '项目终止'">
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="终止事由">
          {{ model.changeFormData.alterationReason }}
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="终止原因">
          {{ model.changeFormData.alterationMatters }}
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="终止时间">
          {{ model.changeFormData.alterationTime }}
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :xl="16" :lg="24">
        <el-form-item label="备注">
          {{ model.changeFormData.remark }}
        </el-form-item>
      </el-col>
    </el-row>
  </div>
</template>

<script lang="ts">
import { defineComponent, onMounted, reactive, watch } from "vue";
import { getProjectInfo, getAacceptanceById } from "/@/api/project";
import { cloneDeep } from "lodash-es";
import { postAlterationList } from "/@/api/change";
import CheckTableList from "../../check/component/table-list.vue";
import BasicsInfo from "../../detail/components/BasicsInfo.vue";
import Goal from "../../create/components/goal.vue";
import Plan from "../../create/components/plan.vue";
export default defineComponent({
  name: "expertReviewDetail",
  components: {
    CheckTableList,
    BasicsInfo,
    Goal,
    Plan
  },
  props: {
    reviewStageName: {
      type: String,
      default: ""
    },
    projectId: {
      type: String,
      default: ""
    }
  },
  setup(props) {
    const model = reactive({
      changePlan: [],
      changeBaseInfo: null,
      changeTargetList: [],
      defaultProposaFileList: [],
      defaultFileList: [],
      tableData: [],
      checkTableData: [],
      reviewDefaultFileList: [],
      approvalDefaultFileList: [],
      evaluationAttachmentList: [],
      projectInfo: null,
      changeFormData: {
        alterationMatters: "",
        alterationReason: "",
        alterationTime: "",
        remark: ""
      }
    });

    const handlePreview = (item: any) => {
      if (item.response) {
        window.open(
          `${location.origin}${location.pathname}#/online?uuidFile=${item?.response.data.uuidFile}&fileName=${item?.response.data.fileName}`
        );
      } else {
        window.open(
          `${location.origin}${location.pathname}#/online?uuidFile=${item.uuidFile}&fileName=${item.fileName}`
        );
      }
    };
    const getProjectFroms = async id => {
      const { code, data } = await getProjectInfo({ id });
      if (code === 200) {
        // model.selectProject = data;
        const copyFormData = cloneDeep(data);
        model.projectInfo = copyFormData;
        if (copyFormData.projectFsbStudyDTO) {
          model.defaultFileList =
            copyFormData.projectFsbStudyDTO.fsbStudyAttachmentArr || [];
          model.defaultFileList.map(el => {
            el["name"] = el.fileName;
          });
        } else {
          model.defaultFileList = [];
        }
        if (copyFormData.projectProposalArr) {
          model.defaultProposaFileList = copyFormData.projectProposalArr;
          model.defaultProposaFileList.map(el => {
            el["name"] = el.fileName;
          });
        } else {
          model.defaultProposaFileList = [];
        }

        if (copyFormData.projectPlans) {
          model.tableData = copyFormData.projectPlans.map(el => {
            return {
              time:
                el.startTime.split(" ")[0] + "至" + el.endTime.split(" ")[0],
              timeObj: [el.startTime.split(" ")[0], el.endTime.split(" ")[0]],
              content: el.researchContent,
              goal: el.goal,
              isDone: el.done,
              doneDes: el.doneDes,
              doneTime: el.doneTime,
              attachment: (el.attachment && JSON.parse(el.attachment)) || []
            };
          });
        }

        if (copyFormData.evaluationAttachment) {
          model.evaluationAttachmentList = JSON.parse(
            copyFormData.evaluationAttachment
          );
        }

        const res = await getAacceptanceById(id);
        if (res.data.finaReportAttachmentArr) {
          model.approvalDefaultFileList = res.data.finaReportAttachmentArr;
          model.approvalDefaultFileList.map(el => {
            el["name"] = el.fileName;
          });
        }

        if (res.data.accReportAttachmentArr) {
          model.reviewDefaultFileList = res.data.accReportAttachmentArr;
          model.reviewDefaultFileList.map(el => {
            el["name"] = el.fileName;
          });
        }
        if (res.data.projectTargetList) {
          res.data.projectTargetList.map(el => {
            if (el.scientificAchv) {
              const strArr = el.scientificAchv.split(",");
              el.scientificAchv = strArr.map(str => +str);
            }
            if (el.scientificAchvs) {
              el.scientificAchvs.map(obj => {
                if (obj.kyAttachmentArr == null) {
                  obj.kyAttachmentArr = [];
                } else {
                  obj.kyAttachmentArr.map(file => {
                    file["name"] = file.fileName;
                  });
                }
              });
            }
          });
          model.checkTableData = res.data.projectTargetList;
        }
        const res3 = await postAlterationList({ projectManageId: id });
        if (res3.code === 200 && res3.data.list.length > 0) {
          let obj = res3.data.list[0];
          const { alterBaseInfo, alterTargetInfo, alterPlanInfo } = JSON.parse(
            obj.alterJsonInfo
          );
          model.changeBaseInfo = alterBaseInfo || null;
          model.changeTargetList = alterTargetInfo || [];
          model.changePlan =
            alterPlanInfo &&
            alterPlanInfo.map(el => {
              return {
                time:
                  el.startTime.split(" ")[0] + "至" + el.endTime.split(" ")[0],
                timeObj: [el.startTime.split(" ")[0], el.endTime.split(" ")[0]],
                content: el.researchContent,
                goal: el.goal,
                alterationType: el.alterationType
              };
            });

          model.changeFormData = res3.data.list[0];
        }
      }
    };
    watch(
      () => props.projectId,
      val => {
        getProjectFroms(val);
      },
      { immediate: true }
    );
    onMounted(() => {});

    return {
      model,
      handlePreview
    };
  }
});
</script>
